<template>
  <view class="page-body flex-col">
    <SearchHead
      @loadData="loadData"
      @resetSearch="resetSearch"
      :isModify.sync="isModify"
      :searchForm.sync="searchForm"
      :tabsList="tabsList"
      ref="SearchHead"
    ></SearchHead>
    <scroll-view @scrolltolower="loadData()" scroll-y class="goods-scroll">
      <OrderList :pageData="pageData" @loadData="loadData"></OrderList>
    </scroll-view>
  </view>
</template>
<script>
import { orderList, delGoods, addGoods } from "@/api/service-home";
import SearchHead from "./components/search-head.vue";

import OrderList from "@/service-home/components/order-list";

export default {
  components: {
    SearchHead,
    OrderList,
  },
  data() {
    return {
      pageData: {
        page: 1,
        list: [],
        loadmoreStatus: "loadmore",
      },
      searchForm: {
        name: "",
        cat_id: "",
        orderby: 0,
        begin: "",
        end: "",
      },

      tabsList: [
        {
          name: "待付款",
          id: "5",
        },
        {
          name: "待接单",
          id: "15",
        },
        {
          name: "待出发",
          id: "20",
        },
        {
          name: "已出发",
          id: "30",
        },
        {
          name: "待服务",
          id: "40",
        },
        {
          name: "进行中",
          id: "50",
        },
        {
          name: "已完成",
          id: "100",
        },
        {
          name: "全部",
          id: "",
        },
      ],
      isModify: false,
    };
  },
  onLoad(params) {
    // 根据订单状态切换tabsIndex
    if (params.ext) {
      this.$nextTick(() => {
        let index = this.tabsList.findIndex((item) => item.id == params.ext);
        this.$refs.SearchHead.tabsChange(index != -1 ? index : 0);
      });
    } else {
      this.loadData();
    }
  },
  onShow() {},
  methods: {
    /*
    reset: 是否重置数据
    isTotal:是否只获取统计数量
    */
    async loadData(reset = false, isTotal = false) {
      if (reset) {
        this.pageData = this.$options.data().pageData;
      }

      if (this.pageData.loadmoreStatus == "nomore" && !isTotal) return;

      const res = await orderList(
        {
          page: this.pageData.page,
          status_ext: this.tabsList[this.$refs["SearchHead"]?.current || 0].id,
          ...this.searchForm,
        },
        true
      );

      if (isTotal) return;
      this.pageData.list.push(...res.data.list);
      this.pageData.page++;
      this.pageData.loadmoreStatus =
        res.data.totalCount <= this.pageData.list.length
          ? "nomore"
          : "loadmore";
    },

    // type: 单个商品还是多选
    async delGoods(item, type) {
      uni.showModal({
        title: "提示",
        content: "您确定移除该产品吗？",
        success: async ({ confirm }) => {
          if (confirm) {
            let ids = item.goods_id ? [item.goods_id] : [];

            if (type == "all") {
              ids = this.pageData.list
                .filter((it) => it.check)
                .map((it) => {
                  return it.goods_id;
                });
            }
            await delGoods({ ids: ids }, true);

            this.pageData.list = this.pageData.list.map((it) => {
              if (ids.some((it1) => it1 === it.goods_id)) {
                it.is_bind = 0;
              }
              return it;
            });
            this.loadData(false, true);
            this.$utils.toast("移除成功");
          }
        },
      });
    },
    // type: 单个商品还是多选
    async addGoods(item, type) {
      let ids = item.goods_id ? [item.goods_id] : [];
      if (type == "all") {
        ids = this.pageData.list
          .filter((it) => it.check)
          .map((it) => it.goods_id);
      }
      await addGoods({ ids: ids }, true);
      this.pageData.list = this.pageData.list.map((it) => {
        if (ids.some((it1) => it1 === it.goods_id)) {
          it.is_bind = 1;
        }
        return it;
      });
      this.loadData(false, true);
      this.$utils.toast("添加成功");
    },
    checkItem(index) {
      let item = JSON.parse(JSON.stringify(this.pageData.list[index]));
      item.check = !item.check;
      this.$set(this.pageData.list, index, item);
    },

    switchAll(check) {
      this.pageData.list = this.pageData.list.map((item) => {
        item.check = check;
        return item;
      });
    },

    resetSearch() {
      this.searchForm = this.$options.data().searchForm;
      this.loadData(true);
    },
  },
  computed: {
    priceFilter() {
      return function (price) {
        if (!price) return [0, ".00"];
        if (typeof price === "number") price = String(price);
        let arr = price.split(".");
        if (arr.length < 2) return [...arr, ".00"];
        return [arr[0], `.${arr[1]}`];
      };
    },
    checkAll() {
      return this.pageData.list.every((item) => item.check);
    },
  },
  watch: {},
  onReachBottom() {},
  onPullDownRefresh() {},
};
</script>
<style lang="scss" scoped>
.font-del {
  text-decoration: line-through;
}
.bg-fff {
  background: #fff;
}
.bdrd-20 {
  border-radius: 20rpx;
}
.price-color {
  color: #f0250e;
}
.page-body {
  height: 100vh;

  .goods-scroll {
    flex: 1;
    height: 0;
    background: #f2f2f2;
    /deep/ .list {
      padding-top: 0;
      padding-bottom: env(safe-area-inset-bottom);
    }
  }
}
</style>
